<template>
  <router-view v-slot="{ Component }">
    <component :is="Component" />
  </router-view>
  <TabBar v-if="shouldShowTabBar" />
</template>

<script setup>
import { computed } from 'vue'
import { useRoute } from 'vue-router'
import { defineAsyncComponent } from 'vue'
 
const route = useRoute()

const TabBar = defineAsyncComponent(() => 
  import('@/components/PageTabBar.vue')
)

// 计算是否显示底部栏
const shouldShowTabBar = computed(() => {
  return route.meta.showTabBar ?? true // 默认显示，未设置meta时显示
})
</script>